// 点击去注册
/*
  分析: 
  (1)获取去注册的按钮
  (2)给按钮注册点击事件
  (3)登录的盒子隐藏 , 注册的盒子显示
*/

// 注册的盒子
const registerBox = qs('.register')
// 登录的盒子
const loginBox = qs('.login')



qs('.login a').onclick = function () {
  // 登录的盒子隐藏
  loginBox.style.display = 'none'
  // 注册的盒子显示
  registerBox.style.display = 'block'
}

qs('.register a').onclick = function () {
  // 登录的盒子显示
  loginBox.style.display = 'block'
  // 注册的盒子隐藏
  registerBox.style.display = 'none'
}

/*
  目标： 给注册按钮绑定点击事件
        form 注册submit事件
        阻止默认行为
        (1)获取获取注册的账号和密码
        (2)发送请求 -- 看接口文档
*/

qs('.register form').onsubmit = function (e) {
  // 阻止默认行为
  e.preventDefault()

  // 获取两个input (注册 和登录 ) 的元素的值
  const username = qs('.register [name="username"]').value.trim()
  const password = qs('.register [name="password"]').value.trim()
  if (!username || !password) return alert('用户名或者密码不能为空')
  // console.log(username,
  //   password);
  // key=value&key=value  --- 后台所需要的数据
  const data = `username=${username}&password=${password}`

  axios.post('/api/register', data).then(({ data: res }) => {
    console.log('注册接口返回的结果', res);
    alert(res.message)
    if (res.code === 0) {
      // 注册成功之后的业务逻辑
      // 将注册的盒子隐藏， 登录的盒子显示
      // 主动触发代码
      qs('.register a').onclick()
    }
  })
}




// 点击去登录
/*
  目标: 给登录按钮绑定点击事件
  form 注册submit事件
  阻止默认行为  
  (1)获取登录的账号和密码
  (2)发送请求 -- 看接口文档
*/
qs('.login form').onsubmit = function (e) {
  e.preventDefault()
  // 获取两个input (注册 和登录 ) 的元素的值
  const username = qs('.login [name="username"]').value.trim()
  const password = qs('.login [name="password"]').value.trim()
  if (!username || !password) return alert('用户名或者密码不能为空')
  console.log(username, password);

  // key=value&key=value  --- 后台所需要的数据
  const data = `username=${username}&password=${password}`

  axios.post('/api/login', data).then(({ data: res }) => {
    console.log('登录接口返回的结果', res);
    alert(res.message)
    if (res.code === 0) {
      localStorage.setItem('token', res.token)
      // 处理登录成功后的业务逻辑  -- 跳转到首页
      location.href = './index.html' // 参照的是login.html 和 index.html的关系
    }
  })
}


// 注册功能


// 登录功能
